<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
</head>

<body>
    <div>这是第1个div</div>
    <div>这是第2个div</div>
    <div>这是第3个div</div>
    <div>这是第4个div</div>
    <div>这是第5个div</div>

    <script>
        (function(window, undefined) {
            // jQuery  => 工厂函数
            var jQuery = function(selector) {
                return new jQuery.fn.init(selector);
            };

            // 原型替换
            jQuery.fn = jQuery.prototype = {
                constructor: jQuery,

                init: function(selector) {
                    var elements = document.querySelectorAll(selector);
                    [].push.apply(this, elements);
                },
                css: function(name, value) {
                    // console.log('css is ok');
                    if (arguments.length === 2) {
                        for (var i = 0; i < this.length; i++) {

                            this[i].style[name] = value;
                        }
                    } else if (arguments.length === 1) {

                        if (typeof name === "object") {

                            for (var i = 0; i < this.length; i++) {
                                // console.log(name);
                                for (var k in name) {

                                    this[i].style[k] = name[k];
                                }
                            }
                        } else if (typeof name === "string") {
                            // return this[0].style[name];
                            // 正确方法：
                            return window.getComputedStyle(this[0], null)[name];
                        }
                    }
                    return this;
                },
            };

            jQuery.fn.init.prototype = jQuery.fn;

            window.jQuery = window.$ = jQuery;
        })(window);

        var $divs = $("div");
        // console.log($divs);

        // $divs.css('color', 'lime');
        // $divs.css('fontSize', '20px');

        $divs.css({
            color: "lime",
            fontSize: "20px",
            backgroundColor: "pink",
        });

        var res = $divs.css("color");
        console.log(res);
    </script>
</body>

</html>